<template>
  <div class="app-page-box">
    <div class="app-page">
      <div class="page-title">
        <Back :cb="goBack" />
        <h3>金融方案</h3>
      </div>
      <div class="plan-desc">
        <div class="plan-name">凯斯-PUMA2254-农用拖拉机(重型)</div>
        <div class="export"><img src="/@/assets/images/export.png" alt="" /> 导出PDF报价单</div>
        <div class="plan-info">
          <span
            >融资金额:<em>{{ rzApplyStore.getCalcTrialParam.financeAmt }}元</em></span
          >
          <span
            >计划起租日:<em>{{ rzApplyStore.getCalcTrialParam.startDate }}月</em></span
          >
          <span
            >计划截止日:<em>{{ rzApplyStore.getCalcTrialParam.endDate }}月</em></span
          >
          <span
            >融资期限:<em>{{ rzApplyStore.getCalcTrialParam.limitMonth }}个月</em></span
          >
          <span
            >租金支付方式:<em>{{ rzApplyStore.getCalcTrialParam.payWay == 'YDBJ' ? '约定本金' : '等额本金' }}</em></span
          >
          <span
            >还款频率:<em>{{ rzApplyStore.getCalcTrialParam.repayRate == 'M' ? '月' : '季度' }}</em></span
          >
          <span
            >小额还本金额:<em>{{ rzApplyStore.getCalcTrialParam.smallAmount }}元</em></span
          >
          <span
            >大额还本时间:<em>{{
              rzApplyStore.getCalcTrialParam.bigAmtMonthArr ? rzApplyStore.getCalcTrialParam.bigAmtMonthArr.join(',') : ''
            }}</em></span
          >
          <span
            >租赁利率:<em>{{ rzApplyStore.getCalcTrialParam.leaseRate }}%</em></span
          >
        </div>
      </div>
      <a-table style="width: 95%; margin: 0 auto" :pagination="false" :dataSource="dataSource" :columns="columns" :scroll="{ y: 240 }">
        <template #bodyCell="{ column, record }">
          <template v-if="column.dataIndex === 'period'">
            <span v-if="record.costType == 'discount'">厂商贴息</span>
            <span v-else-if="record.costType == 'otherexpense'">保险费用</span>
            <span v-else-if="record.costType == 'rent_risk'">承租人风险金</span>
            <span v-else-if="record.costType == 'retain'">留购价</span>
            <span v-else>{{ record.period }}</span>
          </template>
        </template>
        <template #summary v-if="dataSource.length > 0">
          <a-table-summary-row>
            <a-table-summary-cell>
              <div style="text-align: center">总价</div>
            </a-table-summary-cell>
            <a-table-summary-cell>
              <div style="text-align: center">{{ totals.totalPrincipal }}</div>
            </a-table-summary-cell>
            <a-table-summary-cell> </a-table-summary-cell>
            <a-table-summary-cell>
              <div style="text-align: center">{{ totals.totalInterest }}</div>
            </a-table-summary-cell>
            <a-table-summary-cell>
              <div style="text-align: center">{{ totals.totalDueAmout }}</div>
            </a-table-summary-cell>
          </a-table-summary-row>
        </template>
      </a-table>
      <div class="next">
        <a-button class="reset" @click="getData('reCalc')">重新计算</a-button>
        <a-button class="reset submit" v-if="bussNo" @click="onSave">保存</a-button>
      </div>
    </div>
  </div>
</template>

<script setup>
  import { reactive, toRefs, onBeforeMount, onMounted, ref, computed } from 'vue';

  import Back from '/@/components/go-back/index.vue';
  import { useRoute, useRouter } from 'vue-router';
  import { rzApplyApi } from '/@/api/system/rzApply';
  import { useRzApplyStore } from '/@/store/modules/system/rzApply';
  import { useUserStore } from '/@/store/modules/system/user';
  let rzApplyStore = useRzApplyStore();
  let userStore = useUserStore();
  const router = useRouter();
  const route = useRoute();
  const dataSource = ref([]);

  const columns = ref([
    {
      title: '期数',
      key: 'period',
      align: 'center',
      dataIndex: 'period',
    },
    {
      title: '本金（元）',
      key: 'principal',
      align: 'center',
      dataIndex: 'principal',
    },
    {
      title: '租赁利率（%）',
      key: 'moneyRate',
      align: 'center',
      dataIndex: 'moneyRate',
    },

    {
      title: '利息（元）',
      key: 'interest',
      align: 'center',
      dataIndex: 'interest',
    },
    {
      title: '租金总额（元）',
      key: 'dueAmout',
      align: 'center',
      dataIndex: 'dueAmout',
    },
    {
      title: '支付日期',
      key: 'dueDate',
      align: 'center',
      dataIndex: 'dueDate',
    },
  ]);
  const bussNo = ref('');
  const result = ref({});
  const totals = computed(() => {
    let totalPrincipal = 0;
    let totalDueAmout = 0;
    let totalInterest = 0;
    dataSource.value.forEach(({ principal, dueAmout, interest }) => {
      totalPrincipal += principal;
      totalInterest += interest;
      totalDueAmout += dueAmout;
    });
    return { totalPrincipal, totalInterest, totalDueAmout };
  });
  async function getData(mode) {
    const param = rzApplyStore.getCalcTrialParam;
    const res = await rzApplyApi.calcTrial({
      planList: mode == 'reCalc' ? dataSource.value : [],
      orders: {
        bigAmtMonth: param.bigAmtMonthArr ? param.bigAmtMonthArr.join(',') : '', //约定大额月份

        bigAmtMonthArr: param.bigAmtMonthArr, //约定大额月份

        depositAmt: param.depositAmt, //留购价

        deviceType: param.deviceType, //设备型号

        discountRate: param.discountRate, //贴息期内利率

        discountSmall: param.discountSmall, //贴息期内是否固定小额

        discountTime: param.discountTime, //贴息时间2

        endDate: param.endDate, //截止日

        financeAmt: param.financeAmt, //融资金额

        firmRebateIntrestDate: param.firmRebateIntrestDate, //贴息时间

        firstPayAmt: param.firstPayAmt, //首付金额

        firstPayRate: param.firstPayRate, //首付比例

        freePeriod: param.freePeriod, //免息期

        leaseRate: param.leaseRate || 0, //租赁利率

        leaseRateLock: param.leaseRateLock, //锁定利率

        leaseTerm: param.leaseTerm, //租赁期限

        lesseeRiskAmt: param.lesseeRiskAmt || 0, //承租人风险金

        lesseeRiskDate: param.lesseeRiskDate, //承租人风险金时间

        lesseeRiskRate: param.lesseeRiskRate || 0, //承租人风险金比例

        limitMonth: param.limitMonth || 0, //租赁期限

        needXirr: param.needXirr || 0, //内部收益率

        otherExpense: param.otherExpense, //约定小额金额

        otherExpenseDate: param.otherExpenseDate, //其他支出时间

        otherRiskAmt: param.otherRiskAmt || '0', //经销商风险金

        otherRiskDate: param.otherRiskDate, //经销商风险金时间

        payWay: param.payWay, //租金支付方式

        priceSchemeId: param.priceSchemeId, //报价方案类型ID

        priceSchemeType: param.priceSchemeType, //试算类型

        purchaseAmt: param.purchaseAmt || 0, //购置总价

        rebateAmt: param.rebateAmt || 0, //厂商返利

        rebateFirmAmt: param.rebateFirmAmt, //贴息金额

        repayRate: param.repayRate, //还款频率

        smallAmount: param.smallAmount, //约定小额金额

        startDate: param.startDate, //起租日
      },
    });
    if (res.code == 0) {
      dataSource.value = res.data.data;
      result.value = res.data.result;
    }
  }
  async function onSave() {
    const param = rzApplyStore.getCalcTrialParam;
    const res = await rzApplyApi.calcTrialSaveOrUpdate({
      planList: dataSource.value,
      orders: {
        bussNo: bussNo.value, //业务单号
        bigAmtMonth: param.bigAmtMonthArr ? param.bigAmtMonthArr.join(',') : '', //约定大额月份

        bigAmtMonthArr: param.bigAmtMonthArr, //约定大额月份

        depositAmt: param.depositAmt, //留购价

        deviceType: param.deviceType, //设备型号

        discountRate: param.discountRate, //贴息期内利率

        discountSmall: param.discountSmall, //贴息期内是否固定小额

        discountTime: param.discountTime, //贴息时间2

        endDate: param.endDate, //截止日

        financeAmt: param.financeAmt, //融资金额

        firmRebateIntrestDate: param.firmRebateIntrestDate, //贴息时间

        firstPayAmt: param.firstPayAmt, //首付金额

        firstPayRate: param.firstPayRate, //首付比例

        freePeriod: param.freePeriod, //免息期

        leaseRate: param.leaseRate || 0, //租赁利率

        leaseRateLock: param.leaseRateLock, //锁定利率

        leaseTerm: param.leaseTerm, //租赁期限

        lesseeRiskAmt: param.lesseeRiskAmt || 0, //承租人风险金

        lesseeRiskDate: param.lesseeRiskDate, //承租人风险金时间

        lesseeRiskRate: param.lesseeRiskRate || 0, //承租人风险金比例

        limitMonth: param.limitMonth || 0, //租赁期限

        needXirr: param.needXirr || 0, //内部收益率

        otherExpense: param.otherExpense, //约定小额金额

        otherExpenseDate: param.otherExpenseDate, //其他支出时间

        otherRiskAmt: param.otherRiskAmt || '0', //经销商风险金

        otherRiskDate: param.otherRiskDate, //经销商风险金时间

        payWay: param.payWay, //租金支付方式

        priceSchemeId: param.priceSchemeId, //报价方案类型ID

        priceSchemeType: param.priceSchemeType, //试算类型

        purchaseAmt: param.purchaseAmt || 0, //购置总价

        rebateAmt: param.rebateAmt || 0, //厂商返利

        rebateFirmAmt: param.rebateFirmAmt, //贴息金额

        repayRate: param.repayRate, //还款频率

        smallAmount: param.smallAmount, //约定小额金额

        startDate: param.startDate, //起租日
        discountEndDay: result.value.discountEndDay || 0,
        leaseRate: result.value.leaseRate || 0,
        otherExpenseAmt: result.value.otherExpenseAmt || 0,
        discountEndDay: result.value.discountEndDay || '',
      },
    });
    if (res.code == 0) {
      router.go(-3);
      router.replace({
        path: '/rzApply/add',
        bussNo: bussNo.value,
      });
    }
  }
  function goBack() {
    if (bussNo.value) {
      router.replace({
        path: '/rzApply/add',
        query: {
          bussNo: rzApplyStore.getBussNo,
        },
      });
    } else {
      router.go(-2);
    }
  }
  onMounted(() => {
    const query = route.query;
    bussNo.value = query.bussNo;
    getData();
  });
</script>
<style scoped lang="less">
  @import url('./index.less');
  .app-page {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    padding: 24rem 20rem;
    .page-title {
      margin-bottom: 33rem;
      display: flex;
      align-items: center;
      position: relative;
      h3 {
        width: 100%;
        font-family: Microsoft YaHei;
        font-size: 30rem;
        color: #000000;
        margin-bottom: 0;
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        text-align: center;
      }
    }
    .plan-desc {
      width: 90%;
      background-image: url(/@/assets/images/plan-bg.png);
      background-repeat: no-repeat;
      background-size: 100% 100%;
      margin: 0 auto 50rem;
      padding: 20rem 20rem 5rem;
      box-sizing: border-box;
      position: relative;
      .plan-name {
        font-family: Microsoft YaHei;
        font-size: 30rem;
        color: #ffffff;
        margin-bottom: 32rem;
      }
      .export {
        width: 215rem;
        height: 35rem;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #ffffff;
        border-radius: 7rem;
        font-size: 20rem;
        color: #fd7342;
        position: absolute;
        right: 25rem;
        top: 25rem;
        img {
          width: 13rem;
          height: 17rem;
          margin-right: 12rem;
        }
      }
      .plan-info {
        text-align: left;
        span {
          display: inline-block;
          font-size: 16rem;
          color: #fccaca;
          text-align: left;
          margin-bottom: 15rem;
          margin-right: 50rem;
          em {
            font-style: normal;
            color: #ffffff;
            margin-left: 10rem;
          }
        }
      }
    }
  }
</style>
